var ec_right1 = echarts.init(document.getElementById('r1'), 'macarons');

var XYQZ = [100, 82, 80, 70, 65, 66, 60, 54, 50, 42, 40]

var ec_right1_option = {
    //标题样式
    title: {
        text: "各省现确诊(含港澳台)",
        textStyle: {
            color: 'white',
        },
        left: 'left'
    },

    tooltip: {
        trigger: 'axis',
        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    grid: {
        top: "16%",
        left: "15%",
        bottom: "5%",
        // containLabel: true
    },
    xAxis:
    {
        show: false,
        type: 'value',
        splitLine: {
            show: false,
            lineStyle: {
                color: "rgba(255,255,255,0.2)",
                type: 'dashed'
            }
        },
        axisTick: {
            show: false
        },
        axisLine: { //  改变x轴颜色
            show: true,
            lineStyle: {
                color: "rgba(255,255,255,0.8)"
            }
        },

        axisLabel: { //  改变x轴字体颜色和大小
            show: false,
            textStyle: {
                color: "rgba(250,250,250,0.6)",
                fontSize: 16
            }
        }
    }
    ,
    yAxis: [{
        type: 'category',
        // data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun', '测试', '测试1', '测试2', '测试3'],
        data:[],
        splitLine: {
            show: true,
            lineStyle: {
                color: "rgba(255,255,255,0.2)",
                type: 'dashed'
            }
        },
        axisTick: {
            show: false
        },
        axisLine: { //  改变y轴颜色
            show: false
        },
        axisLabel: { //  改变y轴字体颜色和大小
            //formatter: '{value} m³ ', //  给y轴添加单位
            textStyle: {
                color: "rgba(250,250,250,0.6)",
                fontSize: 16
            }
        }

    },
    {
        show: true,
        data: [100, 82, 80, 70, 65, 66, 60, 54, 50, 42, 40],
        //不显示刻度
        axisTick: {
            show: false
        },
        //不显示y轴线条
        axisLine: {
            show: false
        },
        //y轴文字的颜色设置为白色
        axisLabel: {
            fontSize: 12,
            color: "#fff ",
        }

    }

    ],
    dataZoom: [//滑动条
        {
            yAxisIndex: 0,//这里是从X轴的0刻度开始
            show: false,//是否显示滑动条，不影响使用
            type: 'slider', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
            startValue: 0, // 从头开始。
            endValue: 4,  // 一次性展示5个。
        },
        {
            yAxisIndex: 1,//这里是从X轴的1刻度开始
            show: false,//是否显示滑动条，不影响使用
            type: 'slider', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
            startValue: 0, // 从头开始。
            endValue: 3,  // 一次性展示4个。
        }
    ],
    series: [
        {
            name: "现有确诊",
            data: [100, 82, 80, 70, 65, 66, 60, 54, 50, 42, 40],
            type: 'bar',
            yAxisIndex: 0,
            //柱子之间的距离
            barCategoryGap: 50,
            //柱子的宽度
            barWidth: 10,
            //柱子设置成圆角
            itemStyle: {
                barBorderRadius: 20,
            },
            //显示柱子内的文字
            label: {
                show: true,
                position: "inside",
                //解析data内的数据
                formatter: "{c}"
            },
            color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
                offset: 0,
                color: 'rgba(47,248,255,.8)'
            }, {
                offset: 1,
                color: 'rgba(47,248,255,0)'
            }]),
        }

    ]
};

ec_right1.setOption(ec_right1_option)

window.addEventListener("resize", function () {
    ec_right1.resize();
});